<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,viewport-fit=cover">
<title></title>
{include file="common/pub_style" /}
<script type="text/javascript" src="__PLUGIN__/clipboard/clipboard.js"></script>
<script type="text/javascript">
	$(document).ready(function() {
        isformnull("#token-form");
        isformnull("#token-form2");
		$(".token-btn").click(function() {
			var taskArray = new Array();
			$("input[name=token]").each(function() {
			   taskArray.push($(this).val());
			});
			if (getformnull("#token-form") == 0) {
				$("#loadingToast").show();
				$.ajax({
					type : 'post',
					url : "",
					dataType : "json",
					data : 'type=1&token=' + taskArray,
					success : function(res) {
						layer.msg(res.msg);
						if (res.code == 99) {
							$("#token-form").get(0).reset();
							gourl('-1','back');
						}
						$("#loadingToast").hide();
					}
				});
			}
		})
		$(".key-btn").click(function() {
			var key = $("input[name='key']").val();
			if (getformnull("#token-form2") == 0) {
				$("#loadingToast").show();
				$.ajax({
					type : 'post',
					url : "",
					dataType : "json",
					data : 'type=2&key=' + key,
					success : function(res) {
						layer.msg(res.msg);
						if (res.code == 99) {
							$("#token-form2").get(0).reset();
							gourl('-1','back');
						}
						$("#loadingToast").hide();
					}
				});
			}
		})
    	var clipboard = new ClipboardJS('#copytoken',{
              text: function(trigger) {
                   layer.msg("{$Think.lang.copy_success}");
                   return trigger.getAttribute('data-text');
              }
        });
    	var clipboard = new ClipboardJS('#copykey',{
              text: function(trigger) {
                   layer.msg("{$Think.lang.copy_success}");
                   return trigger.getAttribute('data-text');
              }
        });
	})
</script>
<script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
<script>LA.init({id:"K3bYhiicCN3Z5yHU",ck:"K3bYhiicCN3Z5yHU"})</script>
<style type="text/css">
.input-text {border: 0px;}
.item {border: 1px solid #ccc; border-radius:15px; margin: 5px; padding: 5px;}
.item span {color: #7e7e7e; margin-right: 10px;}
</style>
</head>
<body>
	<div class="header-wrap">
		<div class="flex flex-between pd10">
			<div class="left-arrow" onclick="javascript:window.history.go(-1);"></div>
			<div class="">{$Think.lang.token_bak}</div>
			<div class=""></div>
		</div>
	</div>
	<div style="height: 70px"></div>
	<div class=" pd20">
		<form id="token-form" class="form-horizontal" action="" method="post">
			<div class="form-row">
				<div class="title label-md">{$Think.lang.token}:</div>
			</div>
			<div class="flex">
			   <div class="flex align-center item"><span>1</span><input type="text" class="input-text" name="token" value="{$token.0}" placeholder="token"></div>
			   <div class="flex align-center item"><span>2</span><input type="text" class="input-text" name="token" value="{$token.1}" placeholder="token"></div>
			   <div class="flex align-center item"><span>3</span><input type="text" class="input-text" name="token" value="{$token.2}" placeholder="token"></div>
			</div>
			<div class="flex">
			   <div class="flex align-center item"><span>4</span><input type="text" class="input-text" name="token" value="{$token.3}" placeholder="token"></div>
			   <div class="flex align-center item"><span>5</span><input type="text" class="input-text" name="token" value="{$token.4}" placeholder="token"></div>
			   <div class="flex align-center item"><span>6</span><input type="text" class="input-text" name="token" value="{$token.5}" placeholder="token"></div>
			</div>
			<div class="flex">
			   <div class="flex align-center item"><span>7</span><input type="text" class="input-text" name="token" value="{$token.6}" placeholder="token"></div>
			   <div class="flex align-center item"><span>8</span><input type="text" class="input-text" name="token" value="{$token.7}" placeholder="token"></div>
			   <div class="flex align-center item"><span>9</span><input type="text" class="input-text" name="token" value="{$token.8}" placeholder="token"></div>
			</div>
			<div class="flex">
			   <div class="flex align-center item"><span>10</span><input type="text" class="input-text" name="token" value="{$token.9}" placeholder="token"></div>
			   <div class="flex align-center item"><span>11</span><input type="text" class="input-text" name="token" value="{$token.10}" placeholder="token"></div>
			   <div class="flex align-center item"><span>12</span><input type="text" class="input-text" name="token" value="{$token.11}" placeholder="token"></div>
			</div>
			<div class="tc pd20" data-text="{$token_str}" id="copytoken">{$Think.lang.copy_token}</div>
			<div class="form-row">
			    {neq name="token|count" value="12"}
				<button type="button" class="input-btn btnform btn-disabled token-btn undefined">
					<span class="btn-content">
						<span>{$Think.lang.btn_confirm}</span>
					</span>
				</button>
				{/neq}				
			</div>
		</form>
	   <!-- <form id="token-form2" class="form-horizontal" action="" method="post">
			<div class="form-row">
				<div class="title label-md">{$Think.lang.key_title}:</div>
			</div>
			<div class="form-row">
			    <input type="text" class="input-text" name="key" value="{$info.key}" placeholder="{$Think.lang.input_key_tips}"> 
			</div>

			<div class="tc pd20" data-text="{$info.key}" id="copykey">{$Think.lang.copy_key}</div>
			<div class="form-row"> 
			    {empty name="info.key"}
				<button type="button" class="input-btn btnform btn-disabled key-btn undefined">
					<span class="btn-content">
						<span>{$Think.lang.btn_confirm}</span>
					</span>
				</button>
				{/empty}
			</div>
		</form>-->
	</div>
	{include file="common/footer" /}
</body>
</html>